<template>
  <div>
    <el-dialog
      title="新增企业"
      :visible.sync="dialogFormVisibleEnterpriseAdd"
      :close-on-click-modal="false"
      @close="handleCloseEnterpriseAddClose"
    >
      <el-form
        ref="ruleFormEnterpriseModify"
        :model="ruleFormEnterpriseModify"
        :rules="rulesEnterpriseModify"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="企业名称" prop="userGroupName">
          <el-input v-model="ruleFormEnterpriseModify.userGroupName" />
        </el-form-item>
        <el-form-item label="开通时间" prop="sysAccountStartTime">
          <el-date-picker
            v-model="ruleFormEnterpriseModify.sysAccountStartTime"
            type="datetime"
            placeholder="选择日期时间"
            align="right"
            :picker-options="pickerOptions"
          />
        </el-form-item>
        <el-form-item label="结束时间" prop="sysAccountEndTime">
          <el-date-picker
            v-model="ruleFormEnterpriseModify.sysAccountEndTime"
            type="datetime"
            placeholder="选择日期时间"
          />
        </el-form-item>
        <el-form-item label="状态" prop="disabledFlag">
          <el-radio-group v-model="ruleFormEnterpriseModify.disabledFlag">
            <el-radio :label="0">启用</el-radio>
            <el-radio :label="1">禁用</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="备注">
          <el-input v-model="ruleFormEnterpriseModify.remark" type="textarea" placeholder="" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" :loading="loadingEnterpriseAdd" @click="submitFormEnterpriseAdd('ruleFormEnterpriseModify')">提交</el-button>
          <el-button @click="resetFormEnterpriseAdd('ruleFormEnterpriseModify')">重置</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import { modify } from '@/api/momo/SysEnterprise.js'
import { success } from '@/utils/tip'
export default {
  name: 'SysEnterpriseModify',
  props: {
    sysEnterpriseModifyToChild: {}
  },
  data() {
    return {
      dialogFormVisibleEnterpriseAdd: false,
      loadingEnterpriseAdd: false,
      ruleFormEnterpriseModify: {
        userGroupName: '',
        sysAccountStartTime: '',
        sysAccountEndTime: '',
        remark: '',
        disabledFlag: 0
      },
      pickerOptions: {
        shortcuts: [{
          text: '今天',
          onClick(picker) {
            picker.$emit('pick', new Date())
          }
        }]
      },
      rulesEnterpriseModify: {
        userGroupName: [
          { required: true, message: '用户名必填', trigger: 'blur' }
        ],
        sysAccountStartTime: [
          { required: true, message: '企业开通时间', trigger: 'blur' }
        ],
        sysAccountEndTime: [
          { required: true, message: '企业结束时间', trigger: 'blur' }
        ]
      }
    }
  },
  watch: {
    sysEnterpriseModifyToChild: {
      deep: true,
      immediate: false,
      handler() {
        this.dialogFormVisibleEnterpriseAdd = true
        this.ruleFormEnterpriseModify = JSON.parse(JSON.stringify(this.sysEnterpriseModifyToChild))
        console.log(this.ruleFormEnterpriseModify)
      }
    }
  },
  methods: {
    submitFormEnterpriseAdd(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.loadingEnterpriseAdd = true
          modify(this.ruleFormEnterpriseModify).then(res => {
            res = res.data
            this.dialogFormVisibleEnterpriseAdd = false
            success(res)
            this.loadingEnterpriseAdd = false
            this.$emit('sysEnterpriseModifyToFather', '我是孩子')
            this.resetFormEnterpriseAdd.remark = ''
            this.resetFormEnterpriseAdd('ruleFormEnterpriseModify')
          }).catch(errorEd => {
            this.loadingEnterpriseAdd = false
          }).finally(() => {
            this.loadingEnterpriseAdd = false
          })
        } else {
          this.loadingEnterpriseAdd = false
          console.log('error submit!!')
          return false
        }
      })
    },
    resetFormEnterpriseAdd(formName) {
      this.ruleFormEnterpriseModify.remark = ''
      this.$refs[formName].resetFields()
    },
    handleCloseEnterpriseAddClose() {
      // this.dialogFormVisibleRoleAdd = false
      // this.$emit('userAddToFather', '我是孩子')
    }
  }
}
</script>

<style scoped>

</style>
